<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Exam</title>
	<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="css/question.css">
</head>
<body ng-app='myExam' ng-controller='mycontroller' class="container">
<div class="form-group" id='keycodein'>
	<label for="keycode" class="col-sm-1 control-label">Key Code</label>
	<div class="col-sm-10">
	<input type="text" id='keycode' class="form-control" placeholder="Enter Key Code">
	</div>
	<div class="col-sm-1">
	<button class='btn btn-primary' ng-click='getexam()'>Enter Exam</button>
	</div>
</div>
<h1 class="page-header">Exam</h1>
	
	<div class="question" ng-repeat='item in question.table'>
		<div class="quet">{{ $index+1 }}.{{ item.que }}</div>
		<div class="radio">
		  <label>
		    <input type="radio" name='ans{{ $index+1 }}' value="a">
		    a.{{ item.a }}
		  </label>
		</div>
		<div class="radio">
		  <label>
		    <input type="radio" name='ans{{ $index+1 }}' value="b">
		    b.{{ item.b }}
		  </label>
		</div>
		<div class="radio">
		  <label>
		    <input type="radio" name='ans{{ $index+1 }}' value="c">
		    c.{{ item.c }}
		  </label>
		</div>
		<div class="radio">
		  <label>
		    <input type="radio" name='ans{{ $index+1 }}' value="d">
		    d.{{ item.d }}
		  </label>
		</div>
	</div>
	<input type="hidden" id='questionNum' value='{{ question.table.length }}'>
	<div class="form-group">
		<button id='submitbtn' class="btn btn-block btn-lg btn-primary" ng-click='submit()'>Submit</button>
	</div>
	<script src="js/jquery-3.0.0.min.js"></script>
	<script src="bootstrap/js/bootstrap.min.js"></script>
	<script src="js/angular.min.js"></script>
	<script type="text/javascript" src="js/config.js"></script>
	<script type="text/javascript">
		var uid;
		$.ajax({
			    type :"get",
			    async:true,
			    url : config.url.loginstate,
			    dataType : "jsonp",
			    data: {},
			    success : function(data){
			      if(data.msg=='ok'){
			      	uid=data.uid;
			      }else{
			        alert("User are not online!\nwill  turn to login page.");
			        window.location.href='login.html';
			      }
			    },
			    error:function(){
			        alert("Can't connet to server!");
			    }
			});
		function getQueryString(name) { 
			var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); 
			var r = window.location.search.substr(1).match(reg); 
			if (r != null) return unescape(r[2]); return null; 
		}
		var exid=getQueryString('exid');
		var app = angular.module('myExam',[]).controller('mycontroller',function($scope) {
			$('#submitbtn').hide();
			$scope.submit=function() {
				var count=$('#questionNum').val();
				var ansArray=Array();
				for(var i=1;i<=count;i++){
					ansArray.push($("input[name=ans"+i+"]:checked").val());
				}
				// alert(JSON.stringify(ansArray));
				var sendansData=Array();
				for(i=0;i<count;i++){
					var ansData=Array();
					ansData.push(uid);
					ansData.push(exid);
					ansData.push($scope.question.table[i].queid);
					ansData.push(ansArray[i]);
					sendansData.push(ansData);
				}
				$.ajax({
				          type :"get",
				          async:true,
				          url : config.url.stuexam,
				          dataType : "jsonp",
				          data: {opt:'answer',values:JSON.stringify(sendansData)},
				          success : function(data){
				            if(data.msg==='ok'){
				              alert("OK! Exam is over");
				              window.location.href='home.html';
				            }else{
				              alert("Enter Exam paper fail!");
				            }
				          },
				          error:function(){
				              alert("Can't connet to server!");
				          }
				      });
			};
			$scope.getexam=function(){
				var keycode=$('#keycode').val();
				$.ajax({
				          type :"get",
				          async:true,
				          url : config.url.stuexam,
				          dataType : "jsonp",
				          data: {opt:'getquestion',keycode:keycode,exid:exid},
				          success : function(data){
				            if(data.msg==='ok'){
				              if(data.table[0].que===undefined){
				              	
				              }else{
				              	$('#keycodein').hide();
				              	$('#submitbtn').show();
				              	$scope.$apply(function() {
				              	  $scope.question=data;
				              	});
				              }
				            }else{
				              alert("Enter Exam paper fail!");
				            }
				          },
				          error:function(){
				              alert("Can't connet to server!");
				          }
				      });
				
			}

		});
	</script>
</body>
</html>